<?php
// 验证用户是否登录
session_start();
$user = isset($_SESSION['user']) ? $_SESSION['user'] : false;
$user = $_SESSION['user'];
if (!$user) {
    exit('请登录后再发表博客');
}
// 
require_once $_SERVER['DOCUMENT_ROOT'] . '/lib/Db.php';
$db = new Db();
$cates = $db->table('cates')->lists();
?>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>发表博客</title>
    <link rel="stylesheet" type="text/css" href="static/bootstrap/css/bootstrap.min.css">
    <script type="text/javascript" src="static/js/jquery-3.2.0.js"></script>
    <script type="text/javascript" src="static/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="static/js/UI.js"></script>
    <script type="text/javascript" src="static/wangEditor/release/wangEditor.min.js"></script>
    <style type="text/css">
        .form>div {
            margin-top: 20px;
        }

        .form .row {
            width: 102%;
        }

        .form .btn {
            margin-top: 20px;
        }
    </style>
</head>

<body>
    <form class="form">
        <div class="row">
            <div class="col-xs-6">
                <div class="input-group input-group-sm">
                    <span class="input-group-addon">博客标题</span>
                    <input type="text" class="form-control" name="title" placeholder="输入博客标题">
                </div>
            </div>
            <div class="col-xs-6">
                <div class="input-group input-group-sm">
                    <span class="input-group-addon">博客分类</span>
                    <select class="form-control" name="cid">
                        <?php foreach ($cates as $cate) { ?>
                            <option value="<?php echo $cate['id']; ?>"><?php echo $cate['title']; ?></option>
                        <?php } ?>
                    </select>
                </div>
            </div>
        </div>
        <div class="input-group input-group-sm">
            <span class="input-group-addon">&nbsp;关&nbsp;键&nbsp;字&nbsp;</span>
            <input type="text" class="form-control" name="keywords" placeholder="输入博客关键字">
        </div>
        <div class="input-group input-group-sm">
            <span class="input-group-addon">博客描述</span>
            <input type="text" class="form-control" name="desc" placeholder="输入博客描述">
        </div>
        <div class="input-group input-group-sm">
            <span class="input-group-addon">博客内容</span>
            <div id="editor">
            </div>
        </div>
        <button class="btn btn-primary" style="float: right" onclick="save();return false;">保存</button>
    </form>
</body>

</html>
<script type="text/javascript">
    // 初始化富文本编辑器
    var editor;

    function initEditor() {
        var E = window.wangEditor;
        editor = new E('#editor');
        editor.customConfig.uploadImgServer = 'upload.php';// 图片存储位置
        editor.customConfig.uploadFileName = 'file_image';// 图片存储名称
        editor.customConfig.zIndex = 1;
        editor.create();
    }
    initEditor();

    // 保存博客
    function save() {
        var data = new Object;// Object要大写！！
        data.title = $.trim($('input[name="title"]').val());
        data.cid = $.trim($('select[name="cid"]').val());
        data.keywords = $.trim($('input[name="keywords"]').val());
        data.desc = $.trim($('input[name="desc"]').val());
        data.contents = editor.txt.html();
        if(data.title==''){
            UI.alert({msg:'请输入博客标题',icon:'error'});
            return;
        }
        if(data.contents=='<p><br></p>'){
            UI.alert({msg:'请输入博客内容',icon:'error'});
            return;
        }
        $.post('service/save_article.php',data,function(res){
            if(res.code>0){
                UI.alert({msg:res.msg,icon:'error'});
            }else{
                UI.alert({msg:res.msg,icon:'ok'});
                setTimeout(function(){parent.window.location.reload();},1000);
            }
        },'json')
    }
</script>